<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport"
        content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <script src="{{ asset('javascript/jquery/jquery-2.1.1.min.js') }}" type="text/javascript"></script>
  <script src="{{ asset('javascript/bootstrap/js/bootstrap.min.js') }}" type="text/javascript"></script>
  <script src="{{ asset('javascript/layer/layer.js') }}" type="text/javascript"></script>
  <link href="{{ asset('javascript/bootstrap/css/bootstrap.min.css') }}" rel="stylesheet" type="text/css" />
  <link href="{{ asset('css/front.css') }}" rel="stylesheet" type="text/css" />
  <link href="{{ asset('resources/imgs/favicon.ico') }}" rel="icon">
  <title>{{ $title  }}</title>
</head>
<body>
<div id="qrcode-section" class="out-section container">
  <div id="qrcode-tenant">
    <img src="{{ asset('resources/imgs/tenant-logo.jpg') }}" alt="">
    <div class="title">
      @if(empty($product))
        --
      @else
        {{ $product->customer->name }}
      @endif
    </div>
    <div class="clear"></div>
  </div>
  <div id="action-section">
    <div class="title">自助服务</div>
    <div id="action-list">
      <div class="col-xs-6">
        <a href="javascript:;" id="action-repair">
          <img src="{{ asset('resources/imgs/repair.png') }}" alt="">
          <p>客户报修</p>
        </a>
      </div>
      <div class="col-xs-6">
        <a href="javascript:;" id="action-complain">
          <img src="{{ asset('resources/imgs/service.png') }}" alt="">
          <p>意见投诉</p>
        </a>
      </div>
      <div class="clear"></div>
    </div>
  </div>
  <div class="clear"></div>
  <div id="info-section">
    <div class="title">产品基本信息</div>
    <div id="info-items">
      <div class="item">
        <div class="col-xs-4 labels">客户</div>
        <div class="col-xs-8 info">
          @if(empty($product))
            --
          @else
            {{ $product->customer->name }}
          @endif
        </div>
        <div class="clear"></div>
      </div>
      <div class="item">
        <div class="col-xs-4 labels">产品编号</div>
        <div class="col-xs-8 info">
          @if(empty($product))
            --
          @else
            {{ $product->product_number }}
          @endif
        </div>
        <div class="clear"></div>
      </div>
      <div class="item">
        <div class="col-xs-4 labels">产品名称</div>
        <div class="col-xs-8 info">
          @if(empty($product))
            --
          @else
            {{ $product->name }}
          @endif
        </div>
        <div class="clear"></div>
      </div>
      <div class="item">
        <div class="col-xs-4 labels">产品类型</div>
        <div class="col-xs-8 info">
          @if(empty($product))
            --
          @else
            {{ $product->type->name ?? '' }}
          @endif
        </div>
        <div class="clear"></div>
      </div>
      <div class="item">
        <div class="col-xs-4 labels">质保开始时间</div>
        <div class="col-xs-8 info">
          @if(empty($product))
            --
          @else
            {{ \Carbon\Carbon::parse($product->warranty_start)->toDateString() }}
          @endif
        </div>
        <div class="clear"></div>
      </div>
      <div class="item">
        <div class="col-xs-4 labels">质保结束时间</div>
        <div class="col-xs-8 info">
          @if(empty($product))
            --
          @else
            {{ \Carbon\Carbon::parse($product->warranty_end)->toDateString() }}
          @endif
        </div>
        <div class="clear"></div>
      </div>
      <div class="item">
        <div class="col-xs-4 labels">质保状态</div>
        <div class="col-xs-8 info">
          @if(empty($product))
            --
          @else
            {{ $product->warranty_status_title }}
          @endif
        </div>
        <div class="clear"></div>
      </div>
      <div class="item">
        <div class="col-xs-4 labels">购买日期</div>
        <div class="col-xs-8 info">
          @if(empty($product))
            --
          @else
            {{ $product->date_buy }}
          @endif
        </div>
        <div class="clear"></div>
      </div>
    </div>
  </div>
</div>
</body>
<script type="text/javascript">
  function showErrorMessage(message) {
    layer.open({
      type: 1,
      title: false,
      closeBtn: 0,
      skin: 'prop-no-product',
      shadeClose: false,
      content: message
    })
  }
  @if(empty($qrcode))
    showErrorMessage('二维码信息错误')
  @elseif(empty($product))
    showErrorMessage('二维码没有绑定商品')
  @endif

  $('.action-pending').click(function() {
    pending()
  });

  $('#action-repair').click(function() {
    window.location = '{{ env('APP_URL') }}/qrcode/repair?qrcode_id={{ $qrcode_id }}&type={{ $type_repair }}';
  });

  $('#action-complain').click(function() {
    window.location = '{{ env('APP_URL') }}/qrcode/repair?qrcode_id={{ $qrcode_id }}&type={{ $type_complain }}';
  });

  function pending() {
    layer.msg('暂未开放', {
      shade: [0.1, '#000']
    });
  }
</script>
</html>